import React,{useState,useEffect} from "react";

// useState() 只接收一个参数 这个参数是初始的state 
// useState返回一个数组 
// 数组的第一个元素是state的当前值 第二个元素是一个函数 用来替换原来的state值

function App() {
// console.log(useState(0));
// useState(0);
const [count,setCount] = useState(0)
const [isHot,setIshot] = useState(true)

// 不传第二个参数的情况
// 不论是初始状态还是更新状态 都会执行useEffect中的回调函数
// useEffect(()=>{
// console.log('useEffect执行了');
// })

// 传个空数组的状况
// 只在初始状态执行一次useeffect的回调函数
// useEffect(()=>{
// console.log('useeffect执行了');
// },[])


// 传指定的state时
// 只在传入的第二个参数中的的state状态发生变化时 执行useEffect中的回调函数
useEffect(()=>{
  console.log('useeffect执行了');
},[count])

const setCounthandel = () => {
  setCount(count + 1);
}
const setIshothandel = () => {
  setIshot(!isHot);
}

  return (
    <div>
      <h1>我今天吃了 {count} 碗饭</h1>
      <button onClick = {setCounthandel}>更新</button>
      <h1>今天天气怎么样</h1>
      <p>{isHot?'热啊':'冷啊'}</p>
      <button onClick={setIshothandel}>更换天气</button>
    </div>
  );
}

export default App;
